{% extends "based/based.html" %}
{% block title %}{{_("URL权限管理")}}-{% endblock %}
{% block content %}
<data id="type" content="{{data.type}}"></data>
<data id="page" content="{{data.page}}"></data>
<data id="keyword" content="{{data.keyword}}"></data>
<div id="app">
    <div class="row">
        <div class="col-xs-12">
            <div class="panel">
                <header class="panel-heading">
                     <i class="fa fa-shield"></i>
                    <strong>
                         {{_("URL&API权限控制")}}(<span class="osr-color-success">{{_("结果")}}{[urls.data_total]}</span>)
                    </strong>
                </header>
                <div class="panel-body table-responsive">
                    <div class="box-tools form-inline">
                        <div class="input-group pull-left">
                            <select class="form-control osr-form-control input-sm" @change="switch_type(1, $event.target.value)">
                                <option :value="t[1]" selected="selected" v-if="t[1] == current_type" v-for="t in types" >
                                {[t[0]]}
                                </option>
                                 <option  :value="t[1]" v-if="t[1] != current_type" v-for="t in types">
                                       {[t[0]]}
                                </option>
                            </select>
                        </div>
                        <div class="input-group pull-right">
                            <input type="text" v-on:keypress="get_urls(1,keyword)" v-model="keyword" class="form-control osr-input input-sm" style="width: 150px;" placeholder="{{_('搜索')}}">
                            <div class="btn-group">
                                <button v-on:click="get_urls(1,keyword)" class="btn btn-sm btn-default osr-btn">
                                    <i class="fa fa-search"></i>
                                </button>
                            </div>
                        </div>

                    </div>
                    <br><br>
                    <div class="btn-group-sm">
                        <a v-if="current_type=='page'" type="button" :href="'/osr-admin/permission/url/add?fp='+page+'&ft='+current_type" class="btn btn-sm osr-btn btn-info">
                          <i class="fa fa-plus"></i> {{_("添加页面")}}
                        </a>

                        <a  target="_blank" type="button" href="/osr-admin/permission/table" class="btn btn-sm osr-btn btn-success">
                          <i class="fa fa-table"></i> {{_("权限表")}}
                        </a>
                     </div>
                    <br>

                    <ul class="list-group">
                        <li class="list-group-item" v-for="url in urls.datas">
                            <!--<div v-if="current_type != 'page'" class="task-title">-->
                                <!--<span class="osr-color-success">{{_("Endpoint")}}: </span>-->
                                <!--<a class="task-title-sp">-->
                                    <!--{[url.endpoint]}-->
                                <!--</a>-->
                            <!--</div>-->
                            <div>
                                <strong class="osr-color-success">{{_("类型")}}: </strong>
                                <a>
                                    {[url.type]}
                                </a>
                            </div>
                            <div class="task-title">
                                <strong class="osr-color-success">{{_("URL(api/路由)")}}: </strong>
                                <a>{[url.url]}</a>
                            </div>
                            <div v-if="url.type=='page'">
                                <span class="osr-color-success">{{_("登录验证")}}: </span>
                                <span v-if="!url.login_auth">
                                    &nbsp;&nbsp;{{_("否")}}
                                </span>
                                <br v-else>
                                <span v-for="(v,k) in url.login_auth" class="task-title-sp">
                                    &nbsp;&nbsp;<b>{[k | uppercase]}:</b>

                                    <i v-if="v" class="fa fa-check osr-color-success"></i>
                                    <i v-else class="fa fa-close osr-color-danger"></i>
                                    <br>
                                </span>
                            </div>
                            <div>
                                <strong class="osr-color-success">{{_("权限验证")}}: </strong>
                                <span v-if="!url.custom_permission">
                                    &nbsp;&nbsp;{{_("未自定义(使用代码中配置的默认权限验证)")}}
                                </span>
                                <br v-else>
                                <span v-for="(v,k) in url.custom_permission" class="task-title-sp">
                                    &nbsp;&nbsp;<b>{[k | uppercase]}:</b>
                                    <span v-for="per in permissions" v-if="v & per[1]" class="osr-color-secondary">
                                        {[per[0]]}&nbsp;
                                    </span>
                                    <span v-if="!v">
                                        {{_("未自定义(使用代码中配置的默认权限验证)")}}
                                    </span>
                                    <br>
                                </span>
                            </div>
                            <br>
                            <div class="btn-group-sm" >
                                <a :href="'/osr-admin/permission/url/edit?id='+url._id+'&ft='+current_type+'&fp='+page" class="btn osr-btn btn-info">
                                    <span class="fa fa-pencil-square-o"></span> {{_("编辑")}}
                                </a>
                                <button v-if="url.type=='page'" v-on:click="warning_modal(null, 'del_url', url._id)" class="btn osr-btn btn-danger osr-pointer">
                                    <span class="fa fa-trash"></span> {{_("删除")}}
                                </button>
                            </div>
                        </li>
                    </ul>
                </div>

                <!-- 页面导航-->
                <div class="text-center hidden-md-down">
                    <ul class="pagination">
                         <li v-if="pages.last < pages.current_page && pages.last>0">
                            <a v-on:click="get_urls( pages.last, keyword)">«</a>
                        </li>
                        <li v-else class="disabled">
                            <a>«</a>
                        </li>

                        <li v-for="page in pages.last_show" >
                            <a v-if="page!='...'" v-on:click="get_urls( page, keyword)">{[page]}</a>
                            <a v-else href="#">...</a>
                        </li>

                        <li class="active">
                            <a v-on:click="get_urls( pages.current_page, keyword)">{[pages.current_page]}</a>
                        </li>

                       <li v-for="page in pages.next_show" >
                            <a v-if="page!='...'" v-on:click="get_urls( page, keyword)" >{[page]}</a>
                            <a v-else href="#">...</a>
                       </li>

                       <li v-if="pages.next > pages.current_page && pages.next<=pages.page_total">
                            <a v-on:click="get_urls( pages.next, keyword)">»</a>
                        </li>
                        <li v-else class="disabled">
                            <a>»</a>
                        </li>
                    </ul>
               </div>
                <!-- //页面导航-->
                <!-- m页面导航-->
                <ul class="pager visible-xs visible-sm">
                    <li v-if="pages.last < pages.current_page && pages.last>0" class="previous">
                        <a v-on:click="get_urls( pages.last, keyword)">
                            {{_("上一页")}}
                        </a>
                    </li>
                    <li v-if="pages.next > pages.current_page  && pages.next<=pages.page_total" class="next">
                        <a v-on:click="get_urls( pages.next, keyword)">{{_("下一页")}}</a>
                    </li>
                </ul>
                <!-- //m页面导航-->

            </div>
        </div>
    </div>
</div>
<script>

    var vue = new Vue({
      el: '#app',
      delimiters:['{[', ']}'],
      data:{
          urls:{datas:{} },

          types:[
                    ["{{_('所有')}}", "all"],
                    ["{{_('ApiUrl')}}", "api"],
                    ["{{_('页面路由')}}", "page"]
                 ],
          keyword:"",
          current_type:"all",
          page:1,
          pages:{},
          permissions:[]
      }
    })

    // 加载完页面执行
    $(document).ready(function(){
        var temp_page = $("#page").attr("content");
        vue.page =  temp_page?temp_page:vue.page;
        var temp_keyword = $("#keyword").attr("content");
        vue.keyword =  temp_keyword?temp_keyword:vue.keyword;
        vue.current_type = $("#type").attr("content");
        get_urls(vue.page, vue.keyword);
    })

    function get_urls(page, kw){
        vue.page = page;
        vue.keyword = kw;
        d = {
            page:vue.page,
            keyword:vue.keyword
        }
        if(vue.current_type != "all" && vue.current_type){
            d["type"] = vue.current_type;
        }

        var result = osrHttp("GET","/api/admin/url/permission", d, args={not_prompt:true});
        result.then(function (r) {
            vue.urls = r.data.urls;
            vue.pages = paging(page_total=vue.urls.page_total,
                            current_page=vue.urls.current_page);
        });

        var url = window.location.pathname+"?page="+page+"&type="+vue.current_type;
        if(vue.keyword){
            url += "&keyword="+vue.keyword;
        }
        history_state(title=null,url=url);

        //permission

        var result2 = osrHttp("GET","/api/admin/role/permission", {}, args={not_prompt:true});
        result2.then(function (r) {
            vue.permissions = r.data.permissions;
            vue.cnt = vue.permissions.length;
            vue.permissions = r.data.permissions;
        });
    }

    function del_url(id){
         d = {
            ids:JSON.stringify([id])
        }
        var result = osrHttp("DELETE","/api/admin/url/permission", d);
        result.then(function (r) {
            if (r.status=="success" && r.data.msg_type=="s"){
                 get_urls(vue.page, vue.keyword);
            }
        });
    }

    function switch_type(page, v){
        vue.current_type = v;
        get_urls(page, "");
        history_state(title=null,url="/osr-admin/permission/url?page="+page+"&type="+v);
    }
</script>
{% endblock %}


